<!DOCTYPE html>
<html lang="en">
<head>
    <meta charset="UTF-8">
    <meta name="viewport" content="width=device-width, initial-scale=1.0">
    <title>Document</title>
</head>
<body>
    <script>
        // 异步 
        // const xhr = new XMLHttpRequest();

        // xhr.open('get','http://localhost:8080/test/first',true); // true

        // xhr.send();

        // xhr.onload = function(){
        //     console.log(xhr.responseText); 可以获取数据
        // }

        /* 
        1. 创建ajax对象
        2. 配置请求信息 
        3. 发出去 
        4.注册了一个请求完成事件 
        5. 收回消息 
        6. 触发接收事件 打印消息  
        */


        // 同步
        // const xhr = new XMLHttpRequest();

        // xhr.open('get','http://localhost:8080/test/first',false); // false

        // xhr.send();

        // xhr.onload = function(){
        //     console.log(xhr.responseText); // 拿不到数据 
        // }

        // 1. 创建ajax对象
        // 2. 配置请求信息 
        // 3. 发出去 等着收回来   同步 必须等待收回来 才执行下一步  
                                // 异步不需要等
        //   => 一会收回来  
        // 4 注册了1个请求完成事件
        //  注册请求事件 之前 本次请求已经完成了 
        //  再也不会有完成行为了  



        // 如何调整  
        //  先注册请求完成事件 
        //  然后 在发送请求  

        // const xhr = new XMLHttpRequest();

        // xhr.open('get','http://localhost:8080/test/first',false); // false

        

        // xhr.onload = function(){
        //     console.log(xhr.responseText); // 拿不到数据 
        // }

        // xhr.send();


        // 异步支持  1 2 3 4 

        // 同步支持   1 2 4 3  


          const xhr = new XMLHttpRequest();

        xhr.open('get','http://localhost:8080/test/first',true);

        

        xhr.onload = function(){
            console.log(xhr.responseText); // 拿不到数据 
        }

        xhr.send();

        // 异步也支持 1 2 4 3 

        // 12 43 同步异步都支持  
        // 所以 以后写 1 2 4 3 



    </script>
</body>
</html>